<template>
    <div class="vue-learn">
        <HelloWorld></HelloWorld>
        <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleTabClick">
            <el-tab-pane 
                v-for="item in tabsList"
                :key="item.key"
                :label="item.name" :name="item.name"
            >
                <component :is="item.componentName"></component>
            </el-tab-pane>
        </el-tabs>
    </div>
</template>
<script setup>
import { ref, onMounted } from 'vue';
import { tabsList } from './config.js';
// import HelloWorld from '@/view/hello-word/index.vue';
import HelloWorld from 'hello-word-test8';


const activeName = ref('')
const handleTabClick = (tab) => {
    console.log('tab', tab);
    
    // console.log(activeName.value)
}

onMounted(() => {
    activeName.value = tabsList[0].key
});

</script>